<?xml version="1.0" encoding="ISO-8859-1" ?>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core_rt" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jstl/fmt" %>    
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@page import="net.groupme.gui.constants.VIEW_VOCABULARY"%>
<%@page import="net.groupme.gui.rendering.constants.RENDERING_CONSTANTS"%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<!-- meta tags, link to css:  -->
	<%@ include file="./jsp-includes/mymetaheader.jsp" %>

	<meta name="keywords" content="bundeskanzlerin, merkel, angela,, bundeskanzlerin,, cdu,, deutschand, angela, forbes, "/>
	<meta name="description" content="Group about Angela Merkel (created during a GroupMe! game by Daniel)."/>
	<c:forEach items="${groupManager.group.resources}" var="res" varStatus="status">
		<meta name="DC.relation" content="<c:out value='${res.URL}'/>"/>
	</c:forEach>
	
	<title><c:out value="${groupManager.group.name}" ></c:out>  [GroupMe! group]</title>
	<!--  Ajax Scripts -->
	<script type='text/javascript' src='<%= request.getContextPath()%>/dwr/interface/DWRSearchManager.js'></script>
	<script type='text/javascript' src='<%= request.getContextPath()%>/dwr/interface/DWRGroupManager.js'></script>
	<script type='text/javascript' src='<%= request.getContextPath()%>/dwr/interface/DWRUserManager.js'></script>
	<script type='text/javascript' src='<%= request.getContextPath()%>/dwr/interface/DWRResourceAggregation.js'></script>
	<script type='text/javascript' src='<%= request.getContextPath()%>/dwr/interface/DWRSearchResultRenderer.js'></script>
	<script type='text/javascript' src='<%= request.getContextPath()%>/dwr/interface/DWRResourceRenderer.js'></script>
	<script type='text/javascript' src='<%= request.getContextPath()%>/dwr/interface/DWRGroupBrowsingManager.js'></script>
	<script type='text/javascript' src='<%= request.getContextPath()%>/dwr/engine.js'></script>
	<script type='text/javascript' src='<%= request.getContextPath()%>/dwr/util.js'> </script>

	<script type="text/javascript" language="javascript">
		/** the Id of the group currently selected */
		var currentGroupId;
		/** the current draggable onject */
		var drag;
	</script>
	<script src="<%= request.getContextPath()%>/scriptaculous/prototype.js" type="text/javascript"></script>
	<script src="<%= request.getContextPath()%>/scriptaculous/scriptaculous.js" type="text/javascript"></script>

	<script type="text/javascript" language="javascript">
	//<![CDATA[//>
		function showAllGroups(){
			dwr.util.byId("searchresults").innerHTML = "<img src='<%= request.getContextPath() + RENDERING_CONSTANTS.RELATIVE_PATH_OF_AJAX_LOADING_IMAGE %>'/>";
			DWRGroupBrowsingManager.getAllGroups(fillSidebar);
		}

		/**
		* Adds content to Sidebar.
		* @param the html String of the Sidebar
		*/
		function fillSidebar(sidebarHTMLString){
			$('searchresults').innerHTML = "";
			$('searchresults').innerHTML += sidebarHTMLString;
		}

   		/**
   		* Called by the ResourceVisualizationMenu to add a Tag to the Resource.
   		* @param the ID of the Resource the Tag should be added to
   		*/
   		function addTag(resourceID, tmpResVisuDivID){
   			resVisuDivID = tmpResVisuDivID;
   			if ("falsefalse" == "truefalse") {
   				key = prompt("Please enter a keyword for the Resource:", "keyword");
   				if (key!=null){
   					DWRGroupManager.addTagToResource(key, resourceID, reloadTags);
   				}
   			}
   			else {
   				alert("Please log in to add a Tag");
   			
   			}
   			
   		}
   		/**
   		* Callback function after adding a Tag to a Resource. Repaints the Tags.
   		* @param a boolean which indicates if addTag was successful.
   		*/
   		function reloadTags(success){
   			if (success == true) {
   				showTags(resVisuDivID);
   				reloadTagCloud();
   			}
   			else {
   				alert('Error while creating Tag.');
   			}
   		}
   		
   		
   		/** BEGIN: GROUP TAGS **/
   		
   		/**
   		* Callback function for reloadGroupTags.
 		* @param tagsArray array of all Tags for this Resource as HtmlFormattedElements
   		*/
   		function showGroupTags(tagsArray){
   			dwr.util.byId("groupTags").innerHTML = createTagString(tagsArray);
   		}
   		
   		
   		/**
   		* Called by the group menu to add a Tag to the actual group.
   		*/
   		function addTagToGroup(){
   			key = prompt("Please enter a keyword for the Group:", "keyword");
   			if (key!=null){
   				DWRGroupManager.addTagToActualGroup(key, reloadGroupTags);
   			}
   		}
   		
   		/**
   		* Callback function after adding a Tag to a Group. Repaints the Tags.
   		* @param a boolean which indicates if tag was added successfully.
   		*/
   		function reloadGroupTags(success){
   			if (success == true) {
   				//the parameter of this method indicates wheather to search for all tags (true) or only for tags 
   				//that were made by the user (false)
   				DWRGroupManager.loadTagsForGroup(true, showGroupTags);
   				reloadTagCloud();
   			}
   			else {
   				alert('Error while creating Tag.');
   			}
   		}
   		
   		/** END: GROUP TAGS **/
   		
   		
   		/**
   		 * Small helper function that formats the given (Html-formatted) Tags
   		 * @param tagsArray array of all Tags for this Resource as HtmlFormattedElements
   		 */
   		function createTagString(tagsArray){
	   		if(tagsArray == null || !(tagsArray.length > 0)){
	   			return "<i>No Tags found.</i>";
	   		}
   			var tagString = "";
			for(var i=0; i<tagsArray.size(); i++){
				tagString = tagString.concat(tagsArray[i].html);
				if(((i + 1) < tagsArray.size()) && (tagsArray.size() > 1)){
					tagString = tagString.concat(", ");
				}
			}
			return tagString;
		}
   		




		/**
		* Visualizes the details about the owner (firstname, username, foafURL, ..)
		* @param userForm a UserForm object that contains the details
		*/
		function showGroupOwnerDetails(userForm){
			var userDetailString = "<a href=\"http://localhost:8080/GroupMe/user/" +  userForm.username + "\" title=\"view user page\">" +  userForm.username + "</a>";
			if( userForm.foafDocumentURL != null){
				userDetailString = userDetailString + "<a href=\"http://xml.mfd-consult.dk/foaf/explorer/?foaf=" + userForm.foafDocumentURL + "\" title=\"Explore FOAF description...\">"
					+ "<img style=\"text-decoration:none;border:none;\"  src=\"http://www.foaf-project.org/images/foafTiny.gif\"/></a>" ;
			}
			$('groupOwner').innerHTML = userDetailString;
		}
		
		/**
		* Adds content to Sidebar.
		* @param the html String of the Sidebar
		*/
		function fillSidebar(sidebarHTMLString){
			$('searchresults').innerHTML = "";
			$('searchresults').innerHTML += sidebarHTMLString;
		}
		
		function checkChoice(){
			if ($('searchSource').options[1].selected == true)
				$("keywordInputField").hide();
			else 
				$("keywordInputField").show();
		}
			
		/**
		* This method is for showing the similar groups for the current vied group.
		*/
		function getSimilarGroups(){
			DWRGroupBrowsingManager.getSimilarGroups(currentGroupId, getSimilarGroupsCallback);
		}
		
		/**
		* The Callback function for getSimilarGroups, sets the similar groups.
		* @param array of HTMLFormattedElements, representing the similar groups.
		*/
		function getSimilarGroupsCallback(similars){
			var tmpHTML = "Similar Groups: <br/>";
			for(var i=0; i<similars.size(); i++){
				tmpHTML += similars[i].html;
			}
			$('similarGroups').innerHTML = tmpHTML;
		}
		
		
		/**
		 * Reload tag cloud of group.
		 * @param groupURI the URI of the group
		 */
		 function reloadTagCloud(){
			 	DWRGroupManager.getGroupTagCloud(showTagCloud);
				$('tagcloud').innerHTML += "<img src=\"<%= request.getContextPath() + RENDERING_CONSTANTS.RELATIVE_PATH_OF_AJAX_LOADING_IMAGE %>\"/> " +
							"<small><i>refreshing tag cloud</i></small>";
		 }
	 	
		/**
		 * Visualize tag cloud of group.
		 */
		 function showTagCloud(tagCloud){
		 	if(tagCloud == null || tagCloud.html == ""){
		 		$('tagcloud').innerHTML = "<i>Neither the group nor its resources are tagged!</i>";
		 	}else{
		 		$('tagcloud').innerHTML = "<strong>Tag Cloud:</strong>" + tagCloud.html;
	 		}
	 	}
	 	
	 	/*
	 	* Subscribe the selected group.
	 	*/
	 	function subscribeGroup(){
	 		DWRUserManager.subscribeGroup('<c:out value="${id}"/>', subscribeResult);
	 	}
	 	
	 	function subscribeResult(indica){
	 		$('subscribe').setStyle({display:'none'});
			$('unsubscribe').setStyle({display:'inline'});
	 		alert(indica);
	 	}
	 	
	 	/*
	 	* Unsubscribe the selected group.
	 	*/
	 	function unsubscribeGroup(){
	 		DWRUserManager.unsubscribeGroup('<c:out value="${id}"/>', unsubscribeResult);
	 	}
	 	
	 	function unsubscribeResult(indica){
	 		$('subscribe').setStyle({display:'inline'});
			$('unsubscribe').setStyle({display:'none'});
	 		alert(indica);
	 	}
   		//init stuff:		
		function init() {
			mousedown = 0;
			idOfResizedResource = 0;
			zAxisIndicator = 5;
			DWRUtil.useLoadingMessage();
			currentGroupId = '<c:out value="${id}"/>';
			loadGroup();
			showAllGroups();
		}
	
</script>
</head>
<body onload="init()" onmousemove="resize2(event);" onmouseup="resize3();">
	<!-- title image, logo:  -->
	<div id="header">
		<%@ include file="./jsp-includes/titleheader.jsp" %>
	</div>
	
	<!-- Menu: -->
	<div id="menu">
		<%@ include file="./jsp-includes/menu.jsp" %>
	</div>

	<!-- content and sidebar -->
	<div id="main">
		<!-- Search Sidebar (aggregating new resources into GroupMe!) -->
		<div id="sidebar">
			<form action="javascript:searchForGroups()" id="searchChooser">
			<strong>Search for groups:</strong><br />
				<select id="searchSource" onchange="checkChoice()">
					<option value="groupmegroups" >search groups</option>

					<option value="all">show all</option>
  				</select> <br/>
			<span id="keywordInputField">keyword: <input type="text" id="searchinput" size="14" maxlength="80" /> </span>
			<input id="submitSearchButton" type="submit" value="search" onclick="searchForGroups()"/>
			</form>
			<br/>
			<strong>Found Groups:</strong><br/>

			<div id="searchresults">
			</div>			
		</div>
			<!-- Content: -->
		<div id="content">
			<div id="upperRight">
				<div id="similarGroups">
					
				</div>
			</div>
			<h1 id="nameOfGroup">${nameOfGroup}</h1>
			<div id="descriptionText" style ="margin-top:1.0em;margin-bottom:0.0em;">
			 	<strong>Description: </strong><c:out value="${groupManager.group.description}" ></c:out>
			</div>
			<div id="tagcloud" style="margin-top:1.3em;margin-bottom:1.3em;"> 
				<strong>Tag Cloud:</strong><c:out value="${tagcloud.html}" escapeXml="false"></c:out>
			</div>
			<div id="rightButtons" style="display:inline;">
				<a id="exportRDF" href="" target="GroupMe! RDF-Export" title="Export GroupMe! Group to RDF">
					<img src="<%= request.getContextPath() %>/images/rdf-48x48.gif" height="24px" width="24px" style="text-decoration:none;border:none;"/>
				</a>
				<a id="exportRSS" href="" target="GroupMe! RSS-Export" title="Export GroupMe! Group to RSS">
					<img src="<%= request.getContextPath() %>/images/rss-48x48.gif" height="24px" width="24px" style="text-decoration:none;border:none;"/>
				</a>
			</div>
			<c:if test="${userManager.loggedIn}">
				<div id="leftButtons" style="display:inline;">
					<a id="addTagButton" href="javascript:addTagToGroup()" target="" title="Add tag to actual GroupMe! Group">
						<img src="<%= request.getContextPath() %>/images/t-48x48.gif" height="24px" width="24px" style="text-decoration:none;border:none;"/>
					</a>
					<a id="subscribe" href="javascript:subscribeGroup()" target="" title="Subscritbe to this GroupMe! Group">
						<img src="<%= request.getContextPath() %>/images/s-48x48.gif" height="24px" width="24px" style="text-decoration:none;border:none;"/>
					</a>
					<a id="unsubscribe" href="javascript:unsubscribeGroup()" target="" title="Unsubscritbe from this GroupMe! Group" style="display:none;">
						<img src="<%= request.getContextPath() %>/images/us-48x48.gif" height="24px" width="24px" style="text-decoration:none;border:none;"/>
					</a>
					<c:if test="${groupManager.ownerOfGroup}">
						<a id="editGroup" href="<%=  VIEW_VOCABULARY.RESTful_GROUP_URI_PATTERN  %><c:out value="${id}"/><%= VIEW_VOCABULARY.RESTful_EDIT_PATTERN %>" target="" title="Edit your GroupMe! Group">
							<img src="<%= request.getContextPath() %>/images/e2-48x48.gif" height="24px" width="24px" style="text-decoration:none;border:none;"/>
						</a>
					</c:if>
				</div>		
			</c:if>
			<div id="groupMenu">
				<strong>tags:</strong>
					<span id="groupTags">-</span>  
				<strong>owner:</strong>
					<span id="groupOwner">-</span>  
			</div>
			<div id="group">
			</div>
		</div>

	</div>
	<div id="footer">
		<p>(c) 2007-2008 <a href="http://www.groupme.org" title="GroupMe! Team">GroupMe! Team</a> - <a href="/GroupMe/contact.jsp" title="contact">contact</a></p>
	</div>
</body>
</html>